import React from 'react';
import Footer from '@/components/Footer';
import { Layout, Typography } from '@arco-design/web-react';
import styles from './style/index.module.less';

const { Paragraph, Text } = Typography;

function Common({ children }: { children: React.ReactNode | null }) {
  return (
    <Typography className={styles.container}>
      <Paragraph className={styles.content}>
        <Paragraph className={styles['content-inner']}>
          <Paragraph className={styles.left}>
            <Paragraph className={styles.firstline}>星乐动</Paragraph>
            <Paragraph className={styles.twoline} bold>
              免费入驻 百万社群
            </Paragraph>
            <Paragraph className={styles.threeline}>
              宝宝树旗下专注青少年体育活动赛事管理平台
            </Paragraph>
            <Paragraph className={styles.quert}>
              <img
                alt=""
                className={styles.img}
                src={require('./img/quert.png')}
              />
            </Paragraph>
          </Paragraph>
          <Paragraph className={styles.right}>{children}</Paragraph>
        </Paragraph>
        <Paragraph className={styles.footer}>
          <Footer />
        </Paragraph>
      </Paragraph>
    </Typography>
  );
}
Common.displayName = 'CommonPage';

export default Common;
